<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	  xmlns:h="http://java.sun.com/jsf/html"
	  xmlns:f="http://java.sun.com/jsf/core"
	  xmlns:ez="http://java.sun.com/jsf/composite/ezcomp"
	  xmlns:c="http://java.sun.com/jsp/jstl/core">
	<h:head>
		<title>Partners</title>
		<link rel="stylesheet" type="text/css" href="css/styles.css"/>
		<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"/>
		<script>
			function markOnChange(node) {

				var currentNode;

				currentNode = node;

				while (currentNode.nodeName !== "TR") {
					currentNode = currentNode.parentNode;
				}

				currentNode = $(currentNode);

				if (node.checked) {
					currentNode.css("background-color", "rgb(214, 235, 255)");
				} else {
					currentNode.css("background", "");
				}
			}
			function cellOnClick(id, name) {
				opener.document.getElementById("form:parentId").value = id;
				opener.document.getElementById("form:parentName").value = name;
				
				close();
				
				return;
				
				var popupElementId = document.documentElement.getAttribute("popupElementId");
				
				popupElement = parent.document.getElementById(popupElementId);
				popupElement.parentNode.removeChild(popupElement);
			}
		</script>
	</h:head>
	
    <f:metadata>
        <f:viewParam name="id" value="#{partnersManagedBean.id}"/>
		<f:viewParam name="choiceMode" value="#{partnersManagedBean.choiceMode}"/>
    </f:metadata>
	
	<h:body>
		<div class="form" style="width: 300px; padding: 5px">
			<div class="command-panel">
				<ez:link  buttonId="create"
						  outcome="partner.xhtml?faces-redirect=true" 
						  imageURL="/images/ListItemCreate.png" 
						  text="Add"/>

				<ez:commandLink  buttonId="markAsDeleted" 
								 buttonActionListener="#{partnersManagedBean.markAsDeleted}"
								 imageURL="/images/MarkAsDeleted.png"
								 text="Delete"/>

				<br class="clear-both"/>
			</div>
			
			<c:choose>
				<c:when test="#{partnersManagedBean.choiceMode == '1'}">
					<c:set var="onclick" value="cellOnClick"/>
				</c:when>
				<c:otherwise>
					<c:set var="outcome" value="partner"/>
				</c:otherwise>
			</c:choose>
			
			<h:dataTable id="table"
						 value="#{partnersManagedBean.partnersMarkedList}"
						 var="item"
						 rules="all"
						 cellpadding="5"
						 class="table"
						 headerClass="button"
						 columnClasses="cell-checkbox, list-element-image, list-element-image, cell, cell, cell, cell"
						 rowClasses="cell"
						 width="298"
						 >
				<h:column>
					<f:facet name="header">
						<h:selectBooleanCheckbox id="markAll"/>
					</f:facet>
					<h:selectBooleanCheckbox 
						id="mark" 
						value="#{item.mark}" 
						class="cell-checkbox"
						onchange="markOnChange(this)"
						/>
				</h:column>

				<h:column>
					<h:graphicImage url="/images/reference/FolderEnter.png" rendered="#{item.value.isFolder}"/>
				</h:column>

				<h:column>
					<h:graphicImage url="/images/reference/Element.png" rendered="#{not item.value.isFolder and not item.value.deletionMark}"/>
					<h:graphicImage url="/images/reference/ElementDeleted.png" rendered="#{not item.value.isFolder and item.value.deletionMark}"/>
					<h:graphicImage url="/images/reference/Folder.png" rendered="#{item.value.isFolder and not item.value.deletionMark}"/>
					<h:graphicImage url="/images/reference/FolderDeleted.png" rendered="#{item.value.isFolder and item.value.deletionMark}"/>
				</h:column>
				<h:column>
					<f:facet name="header">
						<h:outputText value="ID"/>
					</f:facet>
					<ez:cell id="id" value="#{item.value.id}" rowId="#{item.value.id}" rowName="#{item.value.name}" outcome="#{outcome}" onclick="#{onclick}"/>
				</h:column>
				<h:column>
					<f:facet name="header">
						<h:outputText value="Code"/>
					</f:facet>
					<ez:cell id="code" value="#{item.value.code}" rowId="#{item.value.id}" rowName="#{item.value.name}" outcome="#{outcome}" onclick="#{onclick}"/>
				</h:column>
				<h:column>
					<f:facet name="header">
						Name
					</f:facet>
					<ez:cell id="name" value="#{item.value.name}" rowId="#{item.value.id}" rowName="#{item.value.name}" outcome="#{outcome}" onclick="#{onclick}"/>
				</h:column>
			</h:dataTable>
		</div>
		<c:if test="#{empty param.choiceMode}">
			<br/>
			<h:form>
				<h:commandButton action="index.xhtml" actionListener="#{partnersManagedBean.fillDB()}" value="Fill database"/>
			</h:form>
		</c:if>
		<script type="text/javascript">
			//<![CDATA[
			//$("tr").not(":first").hover(
			//		function() {
			//			$(this).css("background-color", "rgb(214, 235, 255)");
			//		},
			//		function() {
			//			$(this).css("background", "");
			//		}
			//);
			//]]>
		</script>
	</h:body>
</html>
